import {Component, OnInit } from '@angular/core';
import {FormControl, FormGroup, Validators} from '@angular/forms';
import {Response} from '@angular/http';
import {IpostData} from '../post-data.interface';
import {AuthService} from '../auth.service';
import {Router} from '@angular/router';
import {StaticValidators} from '../../common/validators';

@Component({
  selector: 'app-register',
  templateUrl: './register.component.html',
  styleUrls: ['./register.component.less']
})
export class RegisterComponent implements OnInit {
  userAgree = true;
  signupForm: FormGroup = new FormGroup({
    'userData': new FormGroup({
      'userName': new FormControl(null, [Validators.required, this.oncheckuserNameStrength.bind(this)], [this.forbiddenNames.bind(this)]),
      'password': new FormControl(null, [Validators.required, this.onCheckPassword.bind(this)]),
      'password2': new FormControl(null, [Validators.required, this.onCheckedPass.bind(this)]),
      'email': new FormControl(null, [Validators.required, Validators.email]),
      'telphone': new FormControl(null, [Validators.required, this.onCheckPhone.bind(this)]),
    }),
    'checkbox': new FormControl(null, [this.onCheckbox.bind(this)])
  });
  passIntensity = '';
  intensityCheck = false;
  password;
  inputTip = false;
  showProtocolModal = false;
  registerData: IpostData = {
    userName: '',
    password: '',
    email: '',
    telphone: ''
  };

  constructor(private authService: AuthService, private router: Router) {
  }

  ngOnInit() {
    console.log(this.signupForm)
    this.signupForm.valueChanges.subscribe(
      (value) => {
        const v = StaticValidators.passwordStrength(value.userData.password);
        if (v === 3) {
            this.intensityCheck = true;
            this.passIntensity = '你的密码很安全';
        } else if (v === 2) {
          this.intensityCheck = true;
          this.passIntensity = '密码安全强度：中等，可以使用三种以上的组合来提高安全强度';
        } else if (v === 1) {
          this.intensityCheck = true;
          this.passIntensity = '密码安全强度：弱，可以使用三种以上的组合来提高安全强度';
        } else {
          this.intensityCheck = false;
        }
      }
    );
  }
  oncheckuserNameStrength(control: FormControl) {
    return StaticValidators.userNameStrength(control);
  }
  forbiddenNames(control: FormControl) {
    const userInfo = {
      userName: control.value
    };
    return this.authService.checkUserName(userInfo)
      .map(response => {
        if (response.nameIsForbidden) {
          return {'nameIsForbidden': true};
        } else {
          return null;
        }
      }
    );
  }

  onCheckPassword(control: FormControl) {
    this.password = control.value;
    return StaticValidators.checkPassword(control);
  }

  onCheckedPass(control: FormControl): {[s: string]: boolean} {
    if (control.value && control.value !== this.password) {
      return {'notSamePass': true};
    }
    return null;
  }

  onCheckPhone(control: FormControl) {
    return StaticValidators.checkPhone(control);
  }
  onCheckbox(control: FormControl) {
    if (control.value) {
      return null;
    }else {
      return {'check123': true};
    }
  }
  onShowProtocol() {
    this.showProtocolModal = true;
}
  onRegister() {
    console.log(this.signupForm);
    this.registerData.userName = this.signupForm.value.userData.userName;
    this.registerData.password = this.signupForm.value.userData.password;
    this.registerData.email = this.signupForm.value.userData.email;
    this.registerData.telphone = this.signupForm.value.userData.phone;
    this.authService.register(this.registerData)
      .subscribe(
        (response) => {
          if (response.register) {
            this.router.navigate(['/login']);
            this.signupForm.reset();
            confirm('恭喜你，注册成功');
          } else {
            console.log('wrong');
          }
        }
      );
  }

}
